<template>
	<view class="content">
		<view class="top">
			<customHeader></customHeader>
			<!-- <customSearch></customSearch> -->
		</view>
		<view class="center">
			<!-- <customSidebar :data="sideList"></customSidebar> -->
			<view style="font-size: 40rpx; font-weight: 700; " v-if="gdDetailMap.customer_name" >客户: {{ gdDetailMap.customer_name }}</view>

			<view class="right_content" style="overflow: auto;" >
				<view style="width: 120%" >
					<t-table>
						<view style="background: #fff;">
							<t-tr style="position: sticky; top: 0; background: #fff; width: 100%; z-index: 9; " >
								<t-th style="flex:0 0 70upx;" >序号</t-th>
								<t-th style="flex:0 0 50upx;word-break: break-all;" >
									<checkbox-group @change="changeAll">
										<checkbox value="selectAll" :checked="selectAll" />
									</checkbox-group>
								</t-th>
								<t-th style="flex:0 0 200upx;" >图片</t-th>
								<!-- <t-th style="flex:0 0 97upx;" >货号</t-th> -->
								<t-th style="flex:0 0 400upx;" >名称</t-th>
								<t-th style="flex:0 0 219upx;" >辅助明细</t-th>
								<t-th style="flex:0 0 139upx;" >辅助数量</t-th>
								<t-th  style="flex:0 0 159upx;">订单数量</t-th>
								<t-th  style="flex:0 0 120upx;">批发价</t-th>
								<t-th  style="flex:0 0 220upx;">订单金额</t-th>
								<t-th style="flex:1;">备注</t-th>
								<t-th style="flex:0 0 60upx;word-break: break-all;" >状态</t-th>

								<t-th style="flex:0 0 249upx;" >
									<view style="display: flex">
										<u--input
											placeholder="输入..."
											style="border: 1rpx solid #ccc;"
											border="surround"
											v-model="shopCarSearchStr"
										></u--input>
										<u-button @click="handleSearchShopCar" style="width: 120rpx;background: #169bd5; color: #fff; font-weight: 500;">搜索</u-button>
									</view>
								</t-th>
							</t-tr>
							<t-tr style="background: #fff;" v-for="(item, index) in shopCarList" :key="item.id" >
								<t-th style="flex:0 0 70upx;">{{ index + 1 }}</t-th>
								<t-th style="flex:0 0 50upx;word-break: break-all;">
									<checkbox-group @change.stop="changeBox($event, item, index)">
										<checkbox value="check" :checked="item.check" />
									</checkbox-group>
								</t-th>
								<t-th style="flex:0 0 200upx;">
									<image 
										style="width: 100%; 
										height: 100%;" 
										mode="scaleToFill" 
										:src="item.files.length ? `${BASE_URL_IMG}${item.files[0].url}` : '../../static/none.png'"></image>
								</t-th>
								<!-- <t-th style="flex:0 0 97upx;" class="table_name">
									<view class="bao_td_left">
										{{ item.no }}
									</view>
								</t-th> -->
								<t-th style="flex:0 0 400upx;" class="table_name">
									<!-- <view class="bao_td_left">
										{{ item.name }}
									</view> -->
									<textarea 
										style="width: 100%; text-align: left; font-weight: 500;" 
										:auto-height="true"
										disabled
										v-model="item.name" />
								</t-th>
								<t-th style="flex:0 0 219upx;" >
									{{ item.displayStr || '' }}
								</t-th>
								<t-th style="flex:0 0 139upx;" >
									<view style="height: 100%; width: 100%; display: flex; align-items: center; justify-content: center; background: #ccc; padding: 0;" @dblclick="handlefzPup(item, index)">
										双击
									</view>
								</t-th>
								<t-th style="flex:0 0 159upx;">
									<view style="display: flex;align-items: center; justify-content: space-between;  height: 56rpx;">
										<!-- <u-button @click="handleMinus(index)" style="margin-right: 20rpx; height: 100%; width: 100rpx; border: none;">
											<u-icon  size="25" name="minus"></u-icon>
										</u-button> -->
										<input  style="text-align: center;" type="number" @input="changeNum(item,index, $event)" v-model.number="item.num" />
										<!-- <u-button @click="handleAdd(index, item)" style="margin-left: 20rpx; height: 100%;  width: 100rpx; border: none;">
											<u-icon  size="25" name="plus"></u-icon>
										</u-button> -->
									</view>
								</t-th>
								
								<t-th style="flex:0 0 120upx;">
									<input :disabled="item.showGift" v-model="item.wholesale" @input="changePrice(item, index, $event)" />
								</t-th>
								<t-th style="flex:0 0 220upx;">
									<!-- 去除浮点数 -->
									{{ (item.num * item.wholesale ).toFixed(2) }}
								</t-th>
								<t-th style="flex:1;" class="table_name">
									<textarea 
										:maxlength="-1" 
										style="max-height: 80rpx; width: 100%; text-align: left;" 
										v-model="item.remark1" 
										@input="changeRemark(item, index, $event)"
										/>
								</t-th>
								<t-th style="flex:0 0 60upx;word-break: break-all;" >
									<checkbox-group @change.stop="changeGift($event, item, index)">
										<checkbox value="showGift" :checked="item.showGift" />
									</checkbox-group>
								</t-th>
								<t-th style="flex:0 0 249upx;">
									<u-button @click="handleDelete(index)" style=" width: 250rpx; height: 56rpx; background: #f59a23; color: #fff; margin: 0;">删除</u-button>
								</t-th>
							</t-tr>
						</view>
					</t-table>
				</view>
			</view>

			<view style="display: flex; align-items: center; justify-content: flex-end " >
				<view style="color: red; width: 400rpx; font-size: 35rpx; " >{{ sumCom }}</view>
				<view style="color: red; width: 400rpx; font-size: 35rpx; " >{{ amountCom.toFixed(2) }}</view>
			</view>

			<view style="display: flex; margin-top: 30rpx;">
				<u-button @click="goShop()" style="background: #f59a23; color: #fff; width: 250rpx;">继续开单</u-button>
				<u-button @click="handleSure('gd')" style="background: #f59a23; color: #fff; width: 250rpx;">挂单</u-button>
				<u-button @click="handleSure('xd')" style="background: #f59a23; color: #fff; width: 250rpx;">确认下单</u-button>
				<!-- <u-button @click="addGdDetails" style="background: #f59a23; color: #fff; width: 250rpx;">添加挂单</u-button> -->
				<u-button @click="handleClearCar" style="background: #f59a23; color: #fff; width: 250rpx;">删除</u-button>
			</view>

			<!--  -->
		</view>



		<!-- 弹出框-下单 -->
		<uni-popup ref="orderPopup" type="center" :mask-click="false">
            <view class="popup_content">

				<!-- 下单页面 开始 -->
				<view v-if="kehuType == 'xd'" style=" flex: 1; overflow: auto; ">
					<view style="display: flex; justify-content: center; align-items: center; border-bottom: 1rpx solid #ccc; padding: 20rpx 0;">
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">客户名称：</text>
							<customDownSearch
								style="flex: 1; height: 30rpx; font-size: 30rpx;"
								:options="KehuListCom"
								:value="form.kehuName"
								v-model="form.kehuName"
								@changeInput="changeInput"
								@input="handleInput"
							></customDownSearch>
						</view>

						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">联系人：</text>
							<input v-model.number="form.user" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">联系电话：</text>
							<input v-model.number="form.phone" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
						
					</view>


					<view style="display: flex; justify-content: center; align-items: center; border-bottom: 1rpx solid #ccc; padding: 20rpx 0;">
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">客户地址：</text>
							<input v-model="form.kehuAddress" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">拖运地址：</text>
							<input v-model="form.tuoyunAddress" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
					</view>
					
					<view style="display: flex; justify-content: center; align-items: center; border-bottom: 1rpx solid #ccc; padding: 20rpx 0;">
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="white-space: nowrap; font-size: 40rpx; font-weight: 700;">经手人：</text>
							<customDownSearch
								style="flex: 1; height: 60rpx; font-size: 30rpx;"
								:options="kdPersonListCom"
								:value="form.kdyw"
								v-model="form.kdyw"
								@changeInput="changeInput2"
								@input="handleInput2"
							></customDownSearch>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">订单备注：</text>
							<input v-model="form.input_Remark" style=" flex: 1; font-size: 30rpx;"></input>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">附加说明：</text>
							<customDownSearch
								style="flex: 1; height: 30rpx; font-size: 30rpx;"
								:options="dictionListCom"
								:value="form.additional"
								v-model="form.additional"
								@changeInput="changeInput5"
								@input="handleInput5"
							></customDownSearch>
						</view>
						
					</view>
					
					
					<view style="display: flex; justify-content: center; align-items: center; border-bottom: 1rpx solid #ccc; padding: 20rpx 0;">
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">收款账户：</text>
							<customDownSearch
								style="flex: 1; height: 30rpx; font-size: 30rpx;"
								:options="queryListCom"
								:value="form.new_account_type"
								v-model="form.new_account_type"
								@changeInput="changeInput4"
								@input="handleInput4"
							></customDownSearch>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">收款金额：</text>
							<input type="digit" v-model="form.collection_je" style=" flex: 1; font-size: 30rpx;"></input>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">优惠金额：</text>
							<input type="digit" v-model="form.discounts_je" style=" flex: 1; font-size: 30rpx;"></input>
						</view>
						
					</view>

					<!-- <view style="display: flex; justify-content: center; align-items: center; border-bottom: 1rpx solid #ccc; padding: 20rpx 0;">
						<text style="font-size: 40rpx; font-weight: 700;">收款类型：</text>
						<customDownSearch
							style="flex: 1; height: 30rpx; font-size: 30rpx;"
							:options="receivePayListCom"
							:value="form.new_collection_type"
							v-model="form.new_collection_type"
							@changeInput="changeInput6"
							@input="handleInput6"
						></customDownSearch>
					</view> -->

					<!-- <view  style="display: flex; justify-content: center; align-items: center; border-bottom: 1rpx solid #ccc; padding: 20rpx 0;">
						<text style="font-size: 40rpx; font-weight: 700;">收款方式：</text>
						<customDownSearch
							style="flex: 1; height: 30rpx; font-size: 30rpx;"
							:options="receiveWayListCom"
							:value="form.new_collection_way"
							v-model="form.new_collection_way"
							@changeInput="changeInput7"
							@input="handleInput7"
						></customDownSearch>
					</view> -->
				</view>
				<!-- 下单页面 结束 -->

				<!-- 新增用户  开始 -->
				<view v-if="kehuType == 'addUser' "  style=" flex: 1; overflow: auto; " >
					<view style="display: flex; justify-content: center; align-items: center; border-bottom: 1rpx solid #ccc; padding: 20rpx 0;">
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">客户编号：</text>
							<input v-model="form.khbh" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">客户名称：</text>
							<input v-model="form.kehuNameAdd" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">联系人：</text>
							<input v-model.number="form.user" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
						
					</view>
					
					<view style="display: flex; justify-content: center; align-items: center; border-bottom: 1rpx solid #ccc; padding: 20rpx 0;">
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">客户地址：</text>
							<input v-model="form.kehuAddress" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">拖运地址：</text>
							<input v-model="form.tuoyunAddress" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
					</view>
					
					<view style="display: flex; justify-content: center; align-items: center; border-bottom: 1rpx solid #ccc; padding: 20rpx 0;">
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">联系电话：</text>
							<input v-model.number="form.phone" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="white-space: nowrap; font-size: 40rpx; font-weight: 700;">客户等级：</text>
							<view style="flex: 1; height: 60rpx; font-size: 30rpx;">
								<customDownSearch
									:options="gradeListCom"
									:value="form.kehuGrade"
									v-model="form.kehuGrade"
									@changeInput="changeInput3"
									@input="handleInput3"
									></customDownSearch>
									<!-- :disabled="true" -->
							</view>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">所属区域：</text>
							<input v-model="form.fromArea" style=" flex: 1; font-size: 30rpx;"></input>
						</view>
					</view>

				</view>
				<!-- 新增用户  结束 -->

				<!-- 挂单 开始 -->
				<view v-if="kehuType == 'gd'" style=" flex: 1; overflow: auto; " >
					<view style="display: flex; justify-content: center; align-items: center; border-bottom: 1rpx solid #ccc; padding: 20rpx 0;">
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">客户名称：</text>
							<customDownSearch
								style="flex: 1; height: 30rpx; font-size: 30rpx;"
								:options="KehuListCom"
								:value="form.kehuName"
								v-model="form.kehuName"
								@changeInput="changeInput"
								@input="handleInput"
							></customDownSearch>
						</view>

						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">联系人：</text>
							<input v-model.number="form.user" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">联系电话：</text>
							<input v-model.number="form.phone" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
					</view>
					
					
					<view style="display: flex; justify-content: center; align-items: center; border-bottom: 1rpx solid #ccc; padding: 20rpx 0;">
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">客户地址：</text>
							<input v-model="form.kehuAddress" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">拖运地址：</text>
							<input v-model="form.tuoyunAddress" style="padding: 0 40rpx 0 0; flex: 1;"></input>
						</view>
					</view>
					
					<view style="display: flex; justify-content: center; align-items: center; border-bottom: 1rpx solid #ccc; padding: 20rpx 0;">
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="white-space: nowrap; font-size: 40rpx; font-weight: 700;">经手人：</text>
							<customDownSearch
								style="flex: 1; height: 60rpx; font-size: 30rpx;"
								:options="kdPersonListCom"
								:value="form.kdyw"
								v-model="form.kdyw"
								@changeInput="changeInput2"
								@input="handleInput2"
							></customDownSearch>
						</view>
						<view style=" display: flex; justify-content: center; align-items: center; width: 100%; " >
							<text style="font-size: 40rpx; font-weight: 700;">订单备注：</text>
							<input v-model="form.input_Remark" style=" flex: 1; font-size: 30rpx;"></input>
						</view>
						
					</view>
				</view>
				<!-- 挂单 结束 -->

				<view class="bottom_btn">
					<u-button @click="handleSureInfo" >
						{{ kehuType == 'xd' ? '确认' :  kehuType == 'addUser' ?  '保存' : '挂单' }}
					</u-button>
					<u-button v-if="['xd', 'gd'].includes(kehuType)" @click="changeType" >添加新客户</u-button>
				</view>

				<view v-if="showToast" class="toast">
					{{ showToastStr }}
				</view>

				<text @click="closeOrderPopup" class="iconfont icon-guanbi"></text>
            </view>
		</uni-popup>


		<!-- 辅助数量 弹出框 -->

		<uni-popup ref="fzPopup" type="center" :mask-click="false">
			<view class="fz_content">
				<view style="margin-bottom: 20upx;">商品多单位录入</view>
				<text @click="closeFzPopup" class="iconfont icon-guanbi"></text>
				<view>
					<t-table>
						<t-tr>
							<t-th style="flex:0 0 150upx;">项目</t-th>
							<t-th style="flex:0 0 150upx;">单位名称</t-th>
							<t-th style="flex:0 0 200upx;">数量</t-th>
							<t-th >单位关系</t-th>
						</t-tr>
						<t-tr v-for="(item, index) in selectFZList" :key="index" >
							<t-th style="flex:0 0 150upx;">{{ item.project }}</t-th>
							<t-th style="flex:0 0 150upx;">{{ item.unitName }}</t-th>
							<t-th style="flex:0 0 200upx;">
								<!-- :disabled="item.disabled"  -->
								<input type="number" 
									@input="changeFzInput($event, index)" 
									v-model.number="item.num" 
									:style="{background: !item.disabled ? '#169bd5' : '', color: !item.disabled ? '#fff' : ''}" />
							</t-th>
							<t-th>{{ item.unitContact }}</t-th>
						</t-tr>
					</t-table>
				</view>

				<view style="background: #f8f9fa; border: 1rpx solid #dee2e6; margin: 20rpx 0; border-radius: 5rpx; " >
					<view style="color: #198754; padding: 10rpx; " > 计算结果: {{ fzCalculationResult.result }}</view>
				</view>

				<view class="bottom_btn">
					<u-button @click="handleSureFz" >确定</u-button>
					<u-button @click="closeFzPopup" >取消</u-button>
				</view>
			</view>
		</uni-popup>

		<!-- 挂单列表 开始 -->
		<!-- <gdDetailTable ref="gdDetailTableRef"></gdDetailTable> -->
		<!-- 挂单列表 结束 -->


	</view>
</template>

<script>
import { mapState, mapMutations, mapGetters } from 'vuex'

import customHeader from '@/components/custom-header/custom-header.vue'
import customSearch from '@/components/custom-search/custom-search.vue'
import customSidebar from '@/components/custom-sidebar/custom-sidebar.vue'
import strAutocomplete from '@/components/str-autocomplete/str-autocomplete.vue'
import customDownSearch from '@/components/custom-downSearch/custom-downSearch.vue'
import tTable from '@/components/t-table/t-table.vue'
import tTh from '@/components/t-table/t-th.vue'
import tTr from '@/components/t-table/t-tr.vue'
import tTd from '@/components/t-table/t-td.vue'
import gdDetailTable from './components/gdDetailTable.vue'
// import xflSelect from '@/components/xfl-select/xfl-select.vue'
import { getAddOrder, getAddCustom, getAddGOrder } from '@/api/modules/index.js'
import { getKehuList, getKdPersonList, getGradeList, getQueryAccts, getDiction, getCollect } from '@/api/modules/select.js'
import { delete_gorders } from "@/api/modules/table.js"
import { BASE_URL_IMG } from "@/api/config"

function debounce  (func, wait) {  
  let timeout;  
  return function() {  
    const context = this;  
    const args = arguments;  
    if (timeout) clearTimeout(timeout);  
    timeout = setTimeout(function() {  
      func.apply(context, args);  
    }, wait);  
  };  
}

	const createtime = getNowFormatDate()
	function getNowFormatDate() {
		// 获取当前日期
		const currentDate = new Date();
		// 格式化为 'YYYY-MM-DD' 格式
		return currentDate.toISOString().split('T')[0];
	}
	export default {
		components:{
			gdDetailTable,
			customHeader, 
			customSearch,
			customSidebar,
			strAutocomplete,
			// xflSelect,
			customDownSearch,
			tTable,
		    tTh,
		    tTr,
		    tTd,
		},
		data() {
			return {
				showFzIndex: 0, // 辅助数量 弹出框 索引
				selectFZList: [],
				form: {
					khbh: '', // 客户编号
					kehuName: '', // 客户名
					kehuNameAdd: '', // 新客户
					phone: '',
					kehuAddress: '', // 客户地址
					tuoyunAddress: '', // 拖运地址
					kdyw: '', // 经手人
					kehuGrade: '', // 客户等级
					fromArea: '', // 所属区域
					input_Remark: '', // 订单备注
					user: '', // 联系人
					additional: '', // 附加说明
					new_account_type: '', // 收款账户
					new_collection_type: '', // 收款类型
					new_collection_way: '', // 收款方式
					collection_je: '', // 收款金额
					discounts_je: '', // 优惠金额
				},
				kehuType: '', // 判断弹出层是新客还是老客
				shopCarSearchStr: '', // 订单内容搜索

				showToast: false, // 消息展示框
				showToastStr: '', // 提示框内容
				timer: '', // 展示毫秒数
				BASE_URL_IMG: BASE_URL_IMG, // 图片地址
				debouncedGetKehu: debounce(this.getKehu, 500),  // 客户名称 防抖
				debouncedKdPerson: debounce(this.getKdPerson, 500),  // 经手人 防抖
				debouncedGrad: debounce(this.getGrad, 500),  // 客户等级 防抖
				debouncedQuery: debounce(this.getQuery, 500),  // 收款账户 防抖
				debouncedDiction: debounce(this.getDictionaries, 500),  // 附加说明 防抖
				jsrDefault: '', // 经手人 默认值
				createtime, // 订单创建时间
				gdDetailMap: {}, // 挂单的 订单详情

				fzCalculationResult: {}, // 计算结果
			}
		},
		onLoad(r) {
			console.log('== r ', r)
			// if (r.gdDetailMap) {
			// 	this.gdDetailMap = JSON.parse(r.gdDetailMap)
			// }
			let obj = {}
			try {
				const storageData = uni.getStorageSync('gdDetailMap')
				if (storageData && storageData !== '') {
					obj = JSON.parse(storageData)
				}
			} catch (error) {
				obj = {}
			}
			this.gdDetailMap = obj


			this.getKehu()
			this.getKdPerson()
			this.getGrad()
			this.getQuery()
			this.getCollectType()
			this.getCollectWay()
			this.getDictionaries()
			let { name } = uni.getStorageSync('userInfo').length ? JSON.parse(uni.getStorageSync('userInfo')) : {}
			this.jsrDefault = name || ''
		},
		computed: {
			KehuListCom(){
				let arr = [];
				 (this.KehuList || []).forEach(i => {
					let newName = i.no + ' - ' + i.name
					arr.push(newName)
				 })
				 return arr
			},
			kdPersonListCom(){
				let arr = [];
				 (this.kdPersonList || []).forEach(i => {
					arr.push(i.name)
				 })
				 return arr
			},
			gradeListCom(){
				let arr = [];
				 (this.gradeList || []).forEach(i => {
					arr.push(i.text)
				 })
				 return arr
			},
			queryListCom() {
				let arr = [];
				 (this.queryList || []).forEach(i => {
					let newName = i.name
					arr.push(newName)
				 })
				 return arr
			},
			receivePayListCom() {
				let arr = [];
				 (this.receivePayList || []).forEach(i => {
					let newName = i.text
					arr.push(newName)
				 })
				 return arr
			},
			receiveWayListCom() {
				let arr = [];
				 (this.receiveWayList || []).forEach(i => {
					let newName = i.text
					arr.push(newName)
				 })
				 return arr
			},
			dictionListCom() {
				let arr = [];
				 (this.dictionList || []).forEach(i => {
					let newName = i.text
					arr.push(newName)
				 })
				 return arr
			},
			...mapState(['shopCarList','KehuList', 'kdPersonList', 'gradeList', 'queryList', 'dictionList', 'areaList', 'selectAll', 'receivePayList', 'receiveWayList']),
			...mapGetters(['sumCom', 'amountCom', ''])
		},
		methods: {
			goShop() { // 跳转 商品列表
				uni.navigateTo({
					 url: `../index/index`
				});
			},
			addGdDetails() {
				// 通过 ref 调用子组件的打开弹出框方法
				this.$refs.gdDetailTableRef.openPopup();
			},
			changeFzInput(e, index) {
				let value = Number(e.target.value)
				let cloneMap = JSON.parse(JSON.stringify(this.selectFZList))
				if (value > 0) {
					this.selectFZList = cloneMap.map((i, j) => ({...i, disabled: true }))
					this.selectFZList[index].disabled = false
				} else {
					this.selectFZList = cloneMap.map((i, j) => ({...i, disabled: false }))
				}
				this.calculateFzTotal()
			},
			// 计算辅助数量乘积
			calculateFzTotal: function() {
				try {
					// 计算所有项目的 num * unitContact 总和
					let total = 0;
					let hasValidItems = false;
					let displayStrings = [];
					let numList = []
					
					if (this.selectFZList && Array.isArray(this.selectFZList)) {
						this.selectFZList.forEach(function(item) {
							if (item && item.num > 0 && item.unitContact) {
								let itemTotal = Number(item.num) * Number(item.unitContact);
								total += itemTotal;
								hasValidItems = true;
							}
							// 构建显示字符串：num + unitName
							if (item && item.num > 0 && item.unitName) {
								displayStrings.push(item.num + item.unitName);
								numList.push(item.num || 0);
							}
						});
					}
					
					this.fzCalculationResult = {
						result: Number(total.toFixed(2)), // 保留2位小数，类型为Number
						hasResult: hasValidItems,
						displayStr: displayStrings.reverse().join(';'), // 倒序排序后用分号分隔的字符串
						numStr: numList.reverse().join(',') // 倒序排序后用分号分隔的字符串
					};
				} catch (error) {
					this.fzCalculationResult = {
						result: Number((0).toFixed(2)),
						hasResult: false,
						displayStr: '',
						numStr: '',
					};
				}
			},

			handlefzPup(item, index) {
				// console.log('== item ', item)
				let numLst = []
				if (item?.qty_details && item?.qty_details.length) {
					numLst = item.qty_details.split(',')
				}

				this.selectFZList = [
					{ project: '基本单位', unitName: item.unit_text, num: Number(numLst[2]) || '', disabled: false, unitContact: 1 },
					{ project: '辅助单位1', unitName: item.unit1_text , num: Number(numLst[1]) || '', disabled: false, unitContact: item.rate1 },
					{ project: '辅助单位2', unitName: item.unit2_text, num: Number(numLst[0]) || '', disabled: false, unitContact: item.rate2 },
				]
				this.showFzIndex = index
				this.$refs.fzPopup.open()
				// 初始化计算结果
				this.calculateFzTotal();
			},
			handleSureFz() { // 辅助弹出框 确定
				let selectItem = this.selectFZList.filter(i => i.num > 0)
				if (!selectItem.length) {
					uni.showToast({
						title: '请输入数量!',
						icon: 'none',
						duration: 1500
					})
					return
				}
				this.changeFieldShopCar(
					{
						index: this.showFzIndex, 
						// target: Number((selectItem[0].num * selectItem[0].unitContact).toFixed(1)), 
						target: this.fzCalculationResult.result, 
						type: 'num'
					})
				this.changeFieldShopCar(
					{
						index: this.showFzIndex, 
						target: this.fzCalculationResult.numStr, 
						type: 'qty_details'
					})
				this.changeFieldShopCar(
				{
					index: this.showFzIndex, 
					target: this.fzCalculationResult.displayStr, 
					type: 'displayStr'
				})
				uni.showToast({
					title: '修改成功!',
					icon: 'none',
					duration: 1500
				})
				setTimeout(() => {
					this.$refs.fzPopup.close()
				}, 2000)
			},
			changeAll() { // 全选
				this.changeAllRadio()
			},
			changeBox(e, item, index) { // 单选
				this.changeRadio(index)
			},
			changeGift(e, item, index) { // 是否赠送礼物
				this.changeRadioGift(index)
			},
			changeNum(item, index, e) { // input 数量 编辑修改
				this.changeFieldShopCar({index, target: Number(e.target.value), type: 'num'})
			},
			changeRemark(item, index, e) { // 修改备注
				this.changeFieldShopCar({index, target: e.target.value, type: 'remark1'})
			},
			changePrice(item, index, e) { // 修改价格
				// this.changeFieldShopCar({index, target: e.target.value, type: 'price'})
				this.changeFieldShopCar({index, target: e.target.value, type: 'wholesale'})
			},
			async handleSureInfo() { // 确认 或者 保存
				if (this.kehuType == 'xd') { // 老客户

					if (!this.shopCarList.length) {
						uni.showToast({
							title: '请添加商品',
							icon: 'none',
							duration: 1500
						})
						return
					}
					if (!this.form.kehuName) {
						uni.showToast({
							title: '请输入客户名称',
							icon: 'none',
							duration: 1500
						})
						return
					}

					if (!this.form.kdyw) {
						uni.showToast({
							title: '请输入经手人',
							icon: 'none',
							duration: 1500
						})
						return
					}

					if (!this.form.kehuAddress) {
						uni.showToast({
							title: '请输入客户地址',
							icon: 'none',
							duration: 1500
						})
						return
					}
					let je = Number(this.form.collection_je) || 0

					if ( this.form.new_account_type && this.form.collection_je <= 0) {
						uni.showToast({
							title: '请输入收款金额',
							icon: 'none',
							duration: 1500
						})
						return
					}

					let sorderis = this.shopCarList.map(i => ({ 
						materiel_id: i.materiel_id ? i.materiel_id : i.id, 
						yquantity: i.num, 
						wholesale: i.wholesale, 
						remark: i.remark1, 
						free: i.showGift,
						qty_details: i.qty_details,
						displayStr: i.displayStr,
					}))

					console.log('== 11 ', JSON.stringify(this.shopCarList))

					let receipt = {
						company_id: this.KehuList.filter(i => this.form.kehuName.includes(i.name))[0]?.id, // 客户 id
						payType_id: this.receivePayList.find(i => i.text == this.form.new_collection_type )?.id || '' , // 收款类型
						payMethod_id: this.receiveWayList.find(i => i.text == this.form.new_collection_way )?.id || '', // 收款方式
						skje: this.form.collection_je || 0, // 收款金额
						yhje: this.form.discounts_je || 0, // 优惠金额
						createtime: this.createtime, // 创建时间
						acct: this.form.new_account_type, // 收款账户
						user_id: this.kdPersonList.filter(i => i.name == this.form.kdyw)[0]?.id,// 制单人 就是取经手人
						type_ipad: 'new',
					}

					let param = {
						customer_id: this.KehuList.filter(i => this.form.kehuName.includes(i.name))[0]?.id, // 客户 id
						bizman_id: this.kdPersonList.filter(i => i.name == this.form.kdyw)[0]?.id, // 业务员 id
						phone: this.form.phone, 
						address: this.form.kehuAddress, // 客户地址
						address2: this.form.tuoyunAddress, // 拖运地址
						pri: 'wmssop_01',  
						area: this.form.area,
						user: this.form.user,  
						submit: true,//true提交订单，false保存订单
						sorderis, 
						remark: this.form.input_Remark, // 订单备注
						additional: this.form.additional, // 附加说明
						account_name: this.form.new_account_type, // 收款账户
						receipt,
					}
					console.log('== param ', param)

					const res = await getAddOrder( JSON.stringify(param) )

					const { data: { status, message } } = res || {}

					if (status == 'success') {
						uni.showToast({
							title: '下单成功',
							icon: 'none',
							duration: 1500
						})
						setTimeout(() => {
							this.$refs.orderPopup.close()
							// if (this.gdDetailMap.id) {
							// 	uni.navigateBack({
							// 		delta: 2
							// 	})
							// }
						}, 1500)
						this.clearShopCar() // 清空购物车
						this.form = {} // 清空表单
						uni.setStorageSync('gdDetailMap', '') // 清空挂单详情;

						if (this.gdDetailMap.id) {
							const res1 = await delete_gorders(JSON.stringify([{ id: this.gdDetailMap.id }])) // 删除挂单
						}

					} else if (status == 'fail') {
						uni.showToast({
							title: message,
							icon: 'none',
							duration: 1500
						})
						setTimeout(() => {
							this.$refs.orderPopup.close()
						}, 1500)
					}
				} else if (this.kehuType == 'addUser') {

					if (!this.form.kehuNameAdd) {
						uni.showToast({
							title: '请输入客户名称',
							icon: 'none',
							duration: 1500
						})
						return
					}
					if (!this.form.user) {
						uni.showToast({
							title: '请输入联系人',
							icon: 'none',
							duration: 1500
						})
						return
					}
					if (!this.form.phone) {
						uni.showToast({
							title: '请输入联系电话',
							icon: 'none',
							duration: 1500
						})
						return
					}
					let pattern = /^1[3-9]\d{9}$/;
					if (!pattern.test(this.form.phone)) {
						uni.showToast({
							title: '电话号码输入不正确',
							icon: 'none',
							duration: 1500
						})
						return
					}

					if (!this.form.kehuAddress) {
						uni.showToast({
							title: '请输入客户地址',
							icon: 'none',
							duration: 1500
						})
						return
					}

					if (!this.form.tuoyunAddress) {
						uni.showToast({
							title: '请输入拖运地址',
							icon: 'none',
							duration: 1500
						})
						return
					}
					if (!this.form.kehuGrade) {
						uni.showToast({
							title: '请输入客户等级',
							icon: 'none',
							duration: 1500
						})
						return
					}
					if (!this.form.fromArea) {
						uni.showToast({
							title: '请输入所属区域',
							icon: 'none',
							duration: 1500
						})
						return
					}

					let param = {
						level_id: this.gradeList.filter(i => this.form.kehuGrade == i.text)[0].id, // 等级id
						level_no: this.gradeList.filter(i => this.form.kehuGrade == i.text)[0].no, // 等级编号
						level_text: this.form.kehuGrade, // 等级名称

						no: this.form.khbh, // 客户编号
						name: this.form.kehuNameAdd, // 客户名称
						addresses: [{
							area: this.form.fromArea, // 所属区域
							phone: this.form.phone, // 联系电话
							address: this.form.kehuAddress, // 客户地址
							address2: this.form.tuoyunAddress, // 拖运地址
							deft: true, // 默认参数
							user: this.form.user, // 联系人
						}]
					}
					const res = await getAddCustom( JSON.stringify(param) );
					const { data: { status } } = res || {}

					if (status == 'success') {
						uni.showToast({
							title: '保存成功',
							icon: 'none',
							duration: 1500
						})
						let param = {
							paging: {
								pageIndex: 1,
								pageSize: -1,
							},
							query: {
								type_nos: ["customer"],
								valid: true,
								search: '', // 搜索字段
							},
						}
						const res1 = await getKehuList(JSON.stringify(param))
						const { data: { data } } = res1 || {}
						this.comKehu(data.companys)
						setTimeout(() => {
							this.$refs.orderPopup.close()
						}, 1500)
						// this.show = false
					} else {
						uni.showToast({
							title: '保存失败',
							icon: 'none',
							duration: 1500
						})
					}
				} else if (this.kehuType == 'gd') { // 挂单
					if (!this.shopCarList.length) {
						uni.showToast({
							title: '请添加商品',
							icon: 'none',
							duration: 1500
						})
						return
					}
					if (!this.form.kehuName) {
						uni.showToast({
							title: '请输入客户名称',
							icon: 'none',
							duration: 1500
						})
						return
					}

					if (!this.form.kdyw) {
						uni.showToast({
							title: '请输入经手人',
							icon: 'none',
							duration: 1500
						})
						return
					}

					if (!this.form.kehuAddress) {
						uni.showToast({
							title: '请输入客户地址',
							icon: 'none',
							duration: 1500
						})
						return
					}

					let sorderis = this.shopCarList.map(i => ({ 
						materiel_id: i.materiel_id ? i.materiel_id : i.id, 
						yquantity: i.num, 
						wholesale: i.wholesale, 
						remark: i.remark1, 
						free: i.showGift,
						qty_details: i.qty_details,
						displayStr: i.displayStr,  
					}))

					let receipt = {
						company_id: this.KehuList.filter(i => this.form.kehuName.includes(i.name))[0]?.id, // 客户 id
						payType_id: this.receivePayList.find(i => i.text == this.form.new_collection_type )?.id || '' , // 收款类型
						payMethod_id: this.receiveWayList.find(i => i.text == this.form.new_collection_way )?.id || '', // 收款方式
						skje: this.form.collection_je || 0, // 收款金额
						yhje: this.form.discounts_je || 0, // 优惠金额
						createtime: this.createtime, // 创建时间
						acct: this.form.new_account_type, // 收款账户
						user_id: this.kdPersonList.filter(i => i.name == this.form.kdyw)[0]?.id,// 制单人 就是取经手人
						type_ipad: 'new',
					}

					let param = {
						customer_id: this.KehuList.filter(i => this.form.kehuName.includes(i.name))[0]?.id, // 客户 id
						bizman_id: this.kdPersonList.filter(i => i.name == this.form.kdyw)[0]?.id, // 业务员 id
						phone: this.form.phone, 
						address: this.form.kehuAddress, // 客户地址
						address2: this.form.tuoyunAddress, // 拖运地址
						pri: 'wmssop_01',  
						area: this.form.area,
						user: this.form.user,  
						submit: true,//true提交订单，false保存订单
						gorderis: sorderis, 
						remark: this.form.input_Remark, // 订单备注
						additional: this.form.additional, // 附加说明
						account_name: this.form.new_account_type, // 收款账户
					}
					console.log('== param ', param)

					if (this.gdDetailMap.id) {
						param.id = this.gdDetailMap.id
					}
					const res = await getAddGOrder( JSON.stringify(param) )

					const { data: { status, message } } = res || {}

					if (status == 'success') {
						uni.showToast({
							title: '挂单成功',
							icon: 'none',
							duration: 1500
						})
						setTimeout(() => {
							this.$refs.orderPopup.close()
							// if (this.gdDetailMap.id) {
							// 	uni.navigateBack({
							// 		delta: 1
							// 	})
							// }
						}, 1500)
						this.clearShopCar() // 清空购物车
						this.form = {} // 清空表单
						uni.setStorageSync('gdDetailMap', '') // 清空挂单详情;
					} else if (status == 'fail') {
						uni.showToast({
							title: message,
							icon: 'none',
							duration: 1500
						})
						setTimeout(() => {
							this.$refs.orderPopup.close()
						}, 1500)
					}
				}
			},
			changeType() {  // 新老客户切换
				this.kehuType = 'addUser'
				this.form = {
					kehuName: '', // 客户名
					kehuNameAdd: '', // 新客户
					phone: '',
					kehuAddress: '', // 客户地址
					tuoyunAddress: '', // 拖运地址
					kdyw: '', // 经手人
					kehuGrade: '', // 客户等级
					fromArea: '', // 所属区域
					user: '', // 联系人
					additional: '', // 附加说明
					new_account_type: '', // 收款账户
					new_collection_type: '', // 收款类型
					new_collection_way: '', // 收款方式
					collection_je: '', // 收款方式
				}
			},

			changeInput(opt) {
				let selectParam = this.KehuList.filter(i => opt.includes(i.name))[0]
				this.form.kehuName = opt

				this.form.phone = selectParam?.addresses[0]?.phone
				this.form.kehuAddress = selectParam?.addresses[0]?.address
				this.form.tuoyunAddress = selectParam?.addresses[0]?.address2
				this.form.user = selectParam?.addresses[0]?.user
				this.form.area = selectParam?.addresses[0]?.area
			},
			handleInput(param) {
				this.form.kehuName = param
				this.debouncedGetKehu(param)
			},
			changeInput2(opt) {
				this.form.kdyw = opt
			},
			handleInput2(param) {
				this.form.kdyw = param
				this.debouncedKdPerson(param)
			},
			changeInput3(opt) {
				this.form.kehuGrade = opt
			},
			handleInput3(param) {
				this.form.kehuGrade = param
				this.debouncedGrad(param)
			},
			changeInput4(opt) {
				this.form.new_account_type = opt
				this.form = {
					...this.form,
					collection_je: this.amountCom, // 收款金额
				}
			},
			handleInput4(param) {
				this.form.new_account_type = param
				this.debouncedQuery(param)
			},
			changeInput6(opt) {
				this.form.new_collection_type = opt
			},
			handleInput6(param) {
				this.form.new_collection_type = param
			},
			changeInput7(opt) {
				this.form.new_collection_way = opt
			},
			handleInput7(param) {
				this.form.new_collection_way = param
			},
			changeInput5(opt) {
				this.form.additional = opt
			},
			handleInput5(param) {
				this.form.additional = param
				this.debouncedDiction(param)
			},

			handleSearchShopCar() { // input 框搜索
				this.searchShopCar(this.shopCarSearchStr)
			},
			handleSure(type) {  // 显示弹出框
				let index = (this.shopCarList || []).map(i => i.num).indexOf('0')
				if ((this.shopCarList || []).filter(i => i.num <= 0).length) {
					uni.showToast({
						title: `第 ${index+1} 行 ${this.shopCarList[index]?.name} 数量为 0 ，请输入数量!`,
						icon: 'none'
					})
					return
				}

				// let priceIndex = (this.shopCarList || []).findIndex(i => !i.showGift && i.price <= 0 )
				let priceIndex = (this.shopCarList || []).findIndex(i => !i.showGift && i.wholesale <= 0 )
				if (priceIndex >= 0) {
					uni.showToast({
						title: `第 ${priceIndex+1} 行 ${this.shopCarList[priceIndex]?.name} 批发价为 0 ，请输入批发价!`,
						icon: 'none'
					})
					return
				}

				this.kehuType = type

				if (this.gdDetailMap.id) {
					this.form = {
						kehuName: this.gdDetailMap.customer_name, // 客户名
						user: this.gdDetailMap.user, // 联系人
						phone: this.gdDetailMap.phone,
						kehuAddress: this.gdDetailMap.address, // 客户地址
						tuoyunAddress: this.gdDetailMap.address2, // 拖运地址
						kdyw: this.gdDetailMap.bizman_name, // 经手人
						input_Remark: this.gdDetailMap.remark, // 备注

						kehuNameAdd: '', // 新客户
						kehuGrade: '', // 客户等级
						fromArea: '', // 所属区域
						additional: '', // 附加说明
						new_account_type: '', // 收款账户
						new_collection_type: '', // 收款类型
						new_collection_way: '', // 收款方式
						// collection_je: this.amountCom, // 收款金额默认值
						collection_je: '', 
					}
				} else {
					this.form = {
						kehuName: '', // 客户名
						kehuNameAdd: '', // 新客户
						phone: '',
						kehuAddress: '', // 客户地址
						tuoyunAddress: '', // 拖运地址
						kdyw: this.jsrDefault, // 经手人
						kehuGrade: '', // 客户等级
						fromArea: '', // 所属区域
						user: '', // 联系人
						additional: '', // 附加说明
						new_account_type: '', // 收款账户
						new_collection_type: '', // 收款类型
						new_collection_way: '', // 收款方式
						// collection_je: this.amountCom, // 收款金额默认值
						collection_je: '', 
					}
				}
				
				// 打开弹出框
				this.$refs.orderPopup.open()
			},
			// 关闭订单弹出框
			closeOrderPopup() {
				this.$refs.orderPopup.close()
			},
			// 关闭辅助数量弹出框
			closeFzPopup() {
				this.$refs.fzPopup.close()
			},
			handleMinus(index) {
				this.minuaNumShopCar(index)
			},
			handleAdd(index, item) {
				this.addNumShopCar(index)
			},
			handleDelete(index) {
				let _this = this
				uni.showModal({
					content: '是否删除',
					success: function (res) {
						if (res.confirm) {
							_this.deleteShopCarItem(index)
						} else if (res.cancel) {
						}
					}
				});
			},
			handleClearCar() { // 清空购物车
				let _this = this
				if (!this.shopCarList.filter(i => i.check).length) {
					uni.showToast({
					    title: '请勾选要删除的商品!',
					    icon: 'none',
					    duration: 3000
					})
					return
				}
				uni.showModal({
					content: '是否删除',
					success: function (res) {
						if (res.confirm) {
							_this.deleteShop()
						} else if (res.cancel) {
						}
					}
				});
			},
			changeData(param) { // 消息弹出框
				this.showToast = true;
				this.showToastStr = param
				this.timer = setTimeout(() => {
					this.showToast = false;
					clearTimeout(this.timer)
				}, 2000)
			},
			async getKehu(str = '') { // 客户信息
				let param = {
					paging: {
						pageIndex: 1,
						pageSize: 200,
					},
					query: {
						type_nos: ["customer"],
						valid: true,
						search: str, // 搜索字段
					},
				}
				const res = await getKehuList(JSON.stringify(param))
				// console.log('==== res 客户信息', res.data)
				const { data: { data } } = res || {}
				
				this.comKehu(data.companys)
			},
			async getKdPerson(str = '') { // 经手人
				let param = {
					paging: {
						pageIndex: 1,
						pageSize: 200,
					},
					query: {
						role_type_no: "wms",
						refcompany: false,
						valid: true,
						search: str, // 搜索字段
					},
				}
				const res = await getKdPersonList(JSON.stringify(param))
				const { data: { data } } = res || {}
				// console.log('== 经手人', res)
				this.comKdPerson(data.users)
			},
			async getGrad(str = '') { // 客户等级
				let param = {
					paging: {
						pageIndex: 1,
						pageSize: 200,
					},
					query: {
						dictype_no: "company_level",
						search: str, // 搜索字段
					},
				}
				const res = await getGradeList(JSON.stringify(param))
				const { data: { data } } = res || {}
				// console.log('== 等级', res)
				this.comGrad(data.dictionaries)
			},
			async getQuery(str = '') { // 收款账户
				let param = {
					paging: {
						pageIndex: 1,
						pageSize: 200,
					},
					query: {
						search: str, // 搜索字段
					},
				}
				const res = await getQueryAccts(JSON.stringify(param))
				const { data: { data } } = res || {}
				let accountsList = (data.accounts || []).map(i => ({...i, str: `${i.acctNo}-${i.type}` }))
				this.comQuery(accountsList)
			},
			async getCollectType(str = '') { // 收款类型
				let param = {
					paging: {
						pageIndex: 1,
						pageSize: 2000,
					},
					query: {
						search: str, // 搜索字段
						dictype_no: 'paymentType'
					},
				}
				const res = await getCollect(JSON.stringify(param))
				const { data: { data } } = res || {}
				let arr = (data.dictionaries || [])
				console.log('== res 收款类型 ', arr)
				
				this.comCollectType(arr)
			},
			async getCollectWay(str = '') { // 收款方式
				let param = {
					paging: {
						pageIndex: 1,
						pageSize: 2000,
					},
					query: {
						search: str, // 搜索字段
						dictype_no: 'paymentMethod'
					},
				}
				const res = await getCollect(JSON.stringify(param))
				const { data: { data } } = res || {}
				let arr = (data.dictionaries || [])
				console.log('== res 收款方式 ', arr)
				
				this.comCollectWay(arr)
			},
			async getDictionaries(str = '') { // 附加说明
				let param = {
					paging: {
						pageIndex: 1,
						pageSize: 200,
					},
					query: {
						search: str, // 搜索字段
						dictype_no: 'additional_dic'
					},
				}
				const res = await getDiction(JSON.stringify(param))
				const { data: { data } } = res || {}  // text
				console.log('== 附加说明', data.dictionaries)
				this.comDiction(data.dictionaries)
			},
			...mapMutations([
                'clearShopCar', 
				'addNumShopCar',
				'minuaNumShopCar',
				'deleteShopCarItem',
				'searchShopCar',
				'comKehu',
				'comKdPerson',
                'comGrad',
				'comQuery',
				'comCollectType',
				'comCollectWay',
				'comDiction',
				'changeRadio',
				'changeRadioGift',
				'changeAllRadio',
				'changeEdit',
				'deleteShop',
				'changeFieldShopCar',
            ]),
		},
		watch: {
			shopCarSearchStr(newVal, oldVal) {
				if (newVal == '') {
					this.searchShopCar()
				}
			},
			shopCarList: {
				handler(newVal, oldVal) {
					if (newVal.length == 0) {
						this.changeEdit(false)
						return
					}

					if (newVal.every(i => i.check)) {
						this.changeEdit(true)
					} else {
						this.changeEdit(false)
					}
				},
				immediate: true,
				deep: true
			},
		}
	}
</script>

<style lang="less" scoped>
.content {
	.top {
		position: fixed;
		width: 100%;
		z-index: 999;
	}
	.bao_td_left {
		width: 100%;
		height: 100%;
		text-align: left;
		font-weight: 500;
	}

	.center {
		padding: 20rpx;
		padding-top: 168rpx;
		display: flex;
		flex-direction: column;
		height: calc(100vh - 220rpx);
		
		.right_content {
			flex: 1;
			background: #fff;
			font-size: 40rpx;
			font-weight: 700;
			display: flex;
			flex-direction: column;
			overflow: auto;

			.none {
				border: none;
			}

			.table_name {
				overflow: hidden; // 溢出的内容隐藏
				text-overflow: ellipsis; // 溢出的部分用省略号...显示
				-webkit-line-clamp: 2; // 行数
				display: -webkit-box; // 将对象作为弹性伸缩盒子模型显示 
				-webkit-box-orient: vertical; // 设置或检索伸缩盒对象的子元素的排列方式
			}
			
			.index_content {
				// height: calc(100vh - 312rpx);
				height: calc(100vh - 600rpx);
				width: 100%;
			}
		}
	}

	.popup_content {
		width: 90vw;
		padding: 60rpx 10rpx;
		padding-top: 80rpx;
		background: #fff;
		font-size: 40rpx;
		position: relative;
		border-radius: 20rpx;
		height: 70vh;
		display: flex;
		flex-direction: column;

		.iconfont {
			position: absolute;
			top: 30rpx;
			right: 50rpx;
			font-size: 40rpx;
		}

		.toast {
			position: absolute;
			top: 140rpx;
			left: 400rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			padding: 20rpx 40rpx;
			border-radius: 15rpx;
			background: #575757;
			color: #fff;
			font-size: 30rpx;
			z-index: inherit;
		}

		.bottom_btn {
			display: flex;
			justify-content: space-around;
			margin-top: 80rpx;
			
			button {
				width: 400rpx;
				height: 100rpx;
				background: #169bd5;
				color: #fff;
				margin: 0;
				font-weight: 500;
				font-size: 60rpx;
			}
		}
	}


	.fz_content {
		width: 1000rpx;
		padding: 80rpx 40rpx;
		background: #fff;
		font-size: 40rpx;
		font-weight: 700;
		position: relative;
		border-radius: 20rpx;
		
		.iconfont {
			position: absolute;
			top: 30rpx;
			right: 50rpx;
			font-size: 40rpx;
		}

		.bottom_btn {
			display: flex;
			justify-content: space-around;
			// margin-top: 80rpx;
			
			button {
				width: 400rpx;
				height: 100rpx;
				background: #169bd5;
				color: #fff;
				margin: 0;
				font-weight: 500;
				font-size: 60rpx;
			}
		}
		.toast {
			position: absolute;
			top: 140rpx;
			left: 400rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			padding: 20rpx 40rpx;
			border-radius: 15rpx;
			background: #575757;
			color: #fff;
			font-size: 30rpx;
			z-index: inherit;
		}
	}
}

.nowrap {
	white-space: nowrap;/* 给文本设置不换行在一行中显示 */
	overflow: hidden;/* 文本超出的部分隐藏 */
	text-overflow: ellipsis;/* 文本超出的部分用省略号代替 */
}
</style>
